<template>
  <div class="payAdd">
    <div class="payAddHead">
      <div class="payLeft"><button>单元详情</button></div>
      <div class="payRight"></div>
    </div>
    <div
      role="tabpanel"
      id="pane-0"
      aria-labelledby="tab-0"
      class="el-tab-pane"
      style="background: white"
    >
      <form class="el-form demo-ruleForm">
        <div class="el-form-item el-form-item--small">
          <label class="el-form-item__label" style="width: 120px"
            >小区名称：</label
          >
          <div class="el-form-item__content" style="margin-left: 120px">
            {{ data.communityname }}
          </div>
        </div>
        <div class="el-form-item el-form-item--small" style="width: 100%">
          <label class="el-form-item__label" style="width: 120px"
            >单元名称：</label
          >
          <div class="el-form-item__content" style="margin-left: 120px">
            <div>{{ data.unitname }}</div>
          </div>
        </div>
        <div class="el-form-item el-form-item--small" style="width: 100%">
          <label class="el-form-item__label" style="width: 120px"
            >栋数：</label
          >
          <div class="el-form-item__content" style="margin-left: 120px">
            <div>{{ data.unitnum }}</div>
          </div>
        </div>
        <div class="el-form-item el-form-item--small" style="width: 100%">
          <label class="el-form-item__label" style="width: 120px"
            >状态：</label
          >
          <div class="el-form-item__content" style="margin-left: 120px">
         
             <div>{{ data.unitstatus == 1 ? "已建成" : "未建成" }}</div>
          </div>
        </div>
        <div class="el-form-item el-form-item--small" style="width: 100%">
          <label class="el-form-item__label" style="width: 120px"
            >资讯问候：</label
          >
          <div class="el-form-item__content" style="margin-left: 120px">
              <div>{{ data.smartstatus }}</div>
          </div>
        </div>
      </form>
    </div>
    <div class="payAddFooter">
      <el-button type="primary" size="middle" @click="handleBack" class="fa fa-mail-reply"
        >返回</el-button
      >
      <el-button type="primary" size="middle" @click="handleSave"   class="fa  fa-save" 
        >编辑</el-button
      >
    </div>
  </div>
</template>
<script>
export default {
  created() {
    console.log(this.$route.query.value);
    this.data = this.$route.query.value;
  },
  data() {
    return {
      data: {},
    };
  },
  methods: {
    // 返回
    handleBack() {
      this.$router.go(-1);
    },
    // 编辑
    handleSave(){
       this.$router.push({
        path:"/house/add",
        query:{title:"编辑单元",value:JSON.stringify(this.data)}
       })
    }
  },
};
</script>
<style lang="scss" scoped>
.payAdd {
  margin: 0.4% 0.2%;
  border: 1px solid #dcdfe6;

  .payAddHead {
    display: flex;

    .payLeft {
      button {
        width: 130px;
        border: 1px solid #dcdfe6;
        border-bottom: #fff;
        padding: 10px 20px;
        color: #409eff;
        background-color: #fff;
      }
    }

    .payRight {
      width: 100%;
      background-color: rgba(0, 0, 2, 0.03);
      border: 1px solid #dcdfe6;
      border-left: none;
    }
  }

  .payAddFooter {
    width: 100px;
    position: absolute;
    right: 0;
    top: 200px;

    .el-button {
      padding: 10px 25px;
      margin: 10px 0;
    }
  }
}
.fa-save:before {
  content: "\f0c7";
}
</style>